import React, { useState } from 'react';
// import styles from './index.less';
import { Modal, Button, Image } from 'antd';
interface TypeProps {
  list: any;
}
const CImageInfoArr: React.FC<TypeProps> = (porps) => {
  const [isModalVisibleImageInfo, setIsModalVisibleImageInfo] = useState(false);
  // const [list] = useState(porps.list);
  return (
    <>
      {porps.list.length > 0 ? (
        <Button
          type="primary"
          size="small"
          onClick={() => {
            setIsModalVisibleImageInfo(true);
          }}
        >
          预览文件
        </Button>
      ) : (
        <></>
      )}

      <Modal
        title="预览文件"
        destroyOnClose
        visible={isModalVisibleImageInfo}
        width={1000}
        onCancel={() => {
          setIsModalVisibleImageInfo(false);
        }}
        footer={[]}
      >
        {porps.list.map((item: any) => {
          return (
            <Image
              key={item.id}
              src={item.http_url}
              fallback=""
            />
          );
        })}
      </Modal>
    </>
  );
};
export default CImageInfoArr;
